<!-- 作品分类 -->
<template>
    <div class='bgff h100 pd pt10'>
        <p class="title-label" >作品分类</p>
        <div class="context-box mt20">
            <n-dynamic-input v-model:value="customValue" :on-create="onCreate" show-sort-button>
                <template #create-button-default>
                    点击新建作品分类
                </template>
                <template #default="{ value }">
                    <div style="display: flex; align-items: center; width: 100%">
                        <n-input v-model:value="value.label" />
                        <n-input v-model:value="value.value" class="ml20"/>
                    </div>
                </template>
            </n-dynamic-input>
        </div>
        <div class="mt20">
            <n-button type="primary" size="medium" @click="saveFun">保存</n-button>
            
        </div>
    </div>
</template>
<script lang='ts' setup>
import { ref } from "vue";
import { callBack, dxpost, qurl, dxget } from "../../../util/index"
const customValue = ref([])
const id = 1
const onCreate = () => {
    return {
        label: '',
        value: ''
    }
}
const initData = async()=>{
    const {data}:any =  await dxget('cyyx/cyyxconfig',{id})
    customValue.value = JSON.parse(data.data)
}
initData()
const saveFun = async()=>{
  const {errno}:any =  await dxpost('cyyx/cyyxconfig',{id,data:JSON.stringify(customValue.value)},'put')
  if(errno==0){
    window.$message.success('保存成功！')
  }
}
</script>
<style scoped>
    .context-box{
        width: 600px;
    }
</style>